<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>写文章</title>
    <link rel="stylesheet" href="/css/index.css">
    <link rel="stylesheet" href="/css/layui.css">
    
    <script src="/layui.js"></script>
    <script src="./power.js"></script>
</head>
<body>
    <header>
        <div class="logo">
            区域论坛系统
        </div>
        <ul>
            <li><a href="/">论坛首页</a></li>
            <li><a href="/article/about">关于我们</a></li>
            <li class="search">
                <div>
                    <input type="search" placeholder="请输入搜索内容">
                    <img src="/search.svg" alt="" class="glass"> 
                </div>
            </li>
        </ul>


        <div class="user"></div>
        <script>
             layui.use( function(){
                  var $ = layui.$
                  if(sessionStorage.user){
                    $('.user').append(`
                        <div>欢迎您：<a class="my" href="/user/users/${JSON.parse(sessionStorage.user).id}">${JSON.parse(sessionStorage.user).username}</a></div>
                    `)
                  }else{
                      $('.user').append(`
                        <div class="login">
                            <a href="/user/userLogin">登录</a>
                        </div>
                        <div class="regrister">
                            <a href="/user/regrister">注册</a>
                        </div>
                      `)
                  }
                });
        </script>




    </header>
    <div id="root">
        <h1 style="text-align: center;margin-bottom: 30px;">写文章</h1>
        <form class="layui-form" action="">
            <div class="layui-form-item">
              <label class="layui-form-label">标题</label>
              <div class="layui-input-block">
                <input type="text" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
              </div>
            </div>
           
            <div class="layui-form-item">
              <label class="layui-form-label">文章类型</label>
              <div class="layui-input-block">
                <select name="type_id" lay-verify="required">
                  <option value=""></option>
                  <% for(let i = 0;i<data.length;i++) {%>
                    <option value="<%= data[i].id %>"><%= data[i].name %></option>
                    <% } %>
                </select>
              </div>
            </div>
            
            <div class="layui-form-item layui-form-text">
              <label class="layui-form-label">文章内容</label>
              <div class="layui-input-block">
                <textarea name="content" placeholder="请输入内容" class="layui-textarea"></textarea>
              </div>
            </div>
            <div class="layui-form-item">
              <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
              </div>
            </div>
          </form>
           
    </div>
      <script>
      //Demo
      layui.use(function(){
        var form = layui.form;
        var $ = layui.$;
        let isDisable = false;
          $.get({
              url:'/power?id='+JSON.parse(sessionStorage.user).id,
              success:function(res){
                  if(res.code != 200){
                      isDisable = true;
                      
                  }
              }
          })
        //监听提交
        form.on('submit(formDemo)', function(data){
          if(data.field.content == ""){
            layer.msg("请输入内容！");
            return false;
          }
          
          if(isDisable){
              layer.msg('账号异常，无法留言，请联系管理员！');
              return false;
          }
          $.post({
            url:'/article/add',
            data:{
              ...data.field,
              create_time:new Date().getTime(),
              user_id:JSON.parse(sessionStorage.user).id
            },
            success:function(res){
              if(res.code == 0){
                layer.msg('提交成功！')
                setTimeout(() => {
                  window.location.href = "/user/users/" + JSON.parse(sessionStorage.user).id
                }, 1000);
              }else{
                layer.msg('提交失败！')
              }
            }
          })
          return false;
        });
      });
      </script>
</body>
</html>